<%@ page import="com.genghis.ptas.question.entity.Answer" %>
<%@ page import="com.genghis.ptas.question.entity.Question" %>
<%@ page import="java.util.List" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!--[if IE 8]> <html lang="en" class="ie8 no-js"> <![endif]-->
<!--[if IE 9]> <html lang="en" class="ie9 no-js"> <![endif]-->
<!--[if !IE]><!-->
<html lang="en"> <!--<![endif]-->
<!-- BEGIN HEAD -->
<head>
    <meta charset="utf-8"/>
    <title>问题信息</title>
    <meta content="width=device-width, initial-scale=1.0" name="viewport"/>
    <meta content="" name="description"/>
    <meta content="" name="author"/>
    <base href="<%=request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+"/scorm/ "%> "/>

    <!-- BEGIN GLOBAL MANDATORY STYLES -->
    <link href="corporate/plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css"/>
    <link href="corporate/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
    <!-- END GLOBAL MANDATORY STYLES -->

    <!-- BEGIN PAGE LEVEL PLUGIN STYLES -->
    <link href="corporate/plugins/fancybox/source/jquery.fancybox.css" rel="stylesheet"/>
    <!-- END PAGE LEVEL PLUGIN STYLES -->

    <!-- BEGIN THEME STYLES -->
    <link href="corporate/css/style-metronic.css" rel="stylesheet" type="text/css"/>
    <link href="corporate/css/style.css" rel="stylesheet" type="text/css"/>
    <link href="corporate/css/themes/blue.css" rel="stylesheet" type="text/css" id="style_color"/>
    <link href="corporate/css/style-responsive.css" rel="stylesheet" type="text/css"/>
    <link href="corporate/css/custom.css" rel="stylesheet" type="text/css"/>
    <!-- END THEME STYLES -->

    <link rel="stylesheet" type="text/css" href="/css/common/global.css"/>
    <link rel="stylesheet" type="text/css" href="js/common/jquery-easyui-1.3.4/themes/bootstrap/easyui.css"/>
    <link rel="stylesheet" type="text/css" href="js/common/jquery-easyui-1.3.4/themes/icon.css"/>
    <link rel="shortcut icon" href="favicon.ico"/>
    <%Question question = (Question) request.getAttribute("questionInfo");%>
    <%Boolean myQuestion = (Boolean) request.getAttribute("myQuestion");%>
    <%List<Answer> answerList = (List<Answer>) request.getAttribute("answerList");%>
</head>
<!-- END HEAD -->

<!-- BEGIN BODY -->
<body>
<!-- BEGIN PAGE CONTAINER -->
<div class="page-container">

    <!-- BEGIN BREADCRUMBS -->
    <div class="row breadcrumbs margin-bottom-40">
        <div class="container">
            <div class="col-md-4 col-sm-4">
                <h1>问题信息</h1>
            </div>
            <div class="col-md-8 col-sm-8">
            </div>
        </div>
    </div>
    <!-- END BREADCRUMBS -->

    <div class="container" style="margin-bottom: 0px">
        <div class="row">
            <div class="col-md-3">
                <ul class="ver-inline-menu tabbable margin-bottom-10">
                    <li class="active">
                        <a data-toggle="tab" href="#info">
                            问题信息
                        </a>
                        <span class="after"></span>
                    </li>
                </ul>
            </div>

            <div class="col-md-9">
                <!-- BEGIN TAB CONTENT -->
                <div class="tab-content">
                    <!-- START TAB 1 -->
                    <div id="info" class="tab-pane active">
                        <div id="info1" class="panel-group">
                            <div class="panel panel-default">
                                <div class="panel-heading">
                                    <h4 class="panel-title">
                                        <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion1"
                                           href="#info1_2">
                                            <%=question.getQuestionContent()%>
                                        </a>
                                    </h4>
                                </div>
                                <div id="info1_2" class="panel-collapse collapse">
                                    <div class="panel-body">

                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- END TAB 1 -->
                </div>
                <!-- END TAB CONTENT -->
            </div>
        </div>
    </div>

    <!-- BEGIN CONTAINER -->
    <div class="container min-hight margin-bottom-40">
        <div class="row">
            <div class="col-md-3">
                <ul class="ver-inline-menu tabbable margin-bottom-10">
                    <li class="active">
                        <a data-toggle="tab" href="#tab_1">
                            回复
                        </a>
                        <span class="after"></span>
                    </li>
                </ul>
            </div>

            <div class="col-md-9">
                <!-- BEGIN TAB CONTENT -->
                <div class="tab-content">
                    <!-- START TAB 1 -->
                    <div id="tab_1" class="tab-pane active">
                        <div id="accordion1" class="panel-group">
                            <%for (Answer answer : answerList) {%>
                            <%if (answer.getIsAdopted() == 0) {%>
                            <div class="panel panel-warning">
                                <div class="panel-heading">
                                    <h4 class="panel-title">
                                        <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion1"
                                           href="#accordion1_<%=answer.getId()%>">
                                            <%=answer.getUserName()%><%=answer.getAnswerDate()%>(<%=answer.getShowIsAdopted()%>)
                                        </a>
                                        <%if (myQuestion) {%>
                                        <button style="margin-left: 780px;margin-top: -25px"
                                                class="btn btn-small btn-success"
                                                type="button"
                                                onclick="adopt('<%=answer.getId()%>')">采纳
                                        </button>
                                        <%}%>
                                    </h4>
                                </div>
                                <div id="accordion1_<%=answer.getId()%>" class="panel-collapse collapse">
                                    <div class="panel-body">
                                        <%=answer.getAnswerContent()%>
                                    </div>
                                </div>
                            </div>
                            <%} else {%>
                            <div class="panel panel-success">
                                <div class="panel-heading">
                                    <h4 class="panel-title">
                                        <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion1"
                                           href="#accordion1_<%=answer.getId()%>">
                                            <%=answer.getUserName()%><%=answer.getAnswerDate()%>(<%=answer.getShowIsAdopted()%>)
                                        </a>
                                        <%if (myQuestion) {%>
                                        <button style="margin-left: 780px;margin-top: -25px"
                                                class="btn btn-small btn-success"
                                                type="button"
                                                onclick="adopt('<%=answer.getId()%>')">采纳
                                        </button>
                                        <%}%>
                                    </h4>
                                </div>
                                <div id="accordion1_<%=answer.getId()%>" class="panel-collapse collapse">
                                    <div class="panel-body">
                                        <%=answer.getAnswerContent()%>
                                    </div>
                                </div>
                            </div>
                            <%}%>
                            <%}%>
                        </div>
                    </div>
                    <!-- END TAB 1 -->
                </div>
                <!-- END TAB CONTENT -->
            </div>
        </div>
    </div>
    <!-- END CONTAINER -->

    <div class="container" style="position:fixed;bottom:10px;width: 93%">
        <div class="row" style="margin-left: 80px;">
            <div class="col-md-3">
                <ul class="ver-inline-menu tabbable margin-bottom-10">
                    <li class="active">
                        <a data-toggle="tab" href="#info">
                            我知道
                        </a>
                        <span class="after"></span>
                    </li>
                </ul>
            </div>

            <div class="col-md-9">
                <!-- BEGIN TAB CONTENT -->
                <div class="tab-content">
                    <!-- START TAB 1 -->
                    <div id="myAnswer" class="tab-pane active">
                        <div id="myAnswer1" class="panel-group">
                            <div class="panel panel-default">
                                <div class="panel-heading" style="height: 53px">
                                    <h4 class="panel-title">
                                        <div class="input-group">
                                            <input id="answer" class="form-control" type="text"/>
                                                <span class="input-group-btn">
                                                    <button class="btn blue" type="button"
                                                            onclick="answerTheQuestion()">提交
                                                    </button>
                                                </span>
                                        </div>
                                    </h4>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- END TAB 1 -->
                </div>
                <!-- END TAB CONTENT -->
            </div>
        </div>
    </div>


</div>
<!-- END PAGE CONTAINER -->

<!-- Load javascripts at bottom, this will reduce page load time -->
<!-- BEGIN CORE PLUGINS(REQUIRED FOR ALL PAGES) -->
<!--[if lt IE 9]>
<script src="corporate/plugins/respond.min.js"></script>
<![endif]-->
<script src="corporate/plugins/jquery-1.10.2.min.js" type="text/javascript"></script>
<script src="corporate/plugins/jquery-migrate-1.2.1.min.js" type="text/javascript"></script>
<script src="corporate/plugins/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
<script type="text/javascript" src="corporate/plugins/hover-dropdown.js"></script>
<script type="text/javascript" src="corporate/plugins/back-to-top.js"></script>
<!-- END CORE PLUGINS -->

<!-- BEGIN PAGE LEVEL JAVASCRIPTS(REQUIRED ONLY FOR CURRENT PAGE) -->
<script type="text/javascript" src="corporate/plugins/fancybox/source/jquery.fancybox.pack.js"></script>
<script src="js/common/jquery-easyui-1.3.4/jquery.easyui.min.js" type="text/javascript"></script>
<script src="js/common/jquery-easyui-1.3.4 /locale/easyui-lang-zh_CN.js" type="text/javascript"></script>
<script src="js/common/common.js" type="text/javascript"></script>
<script src="corporate/scripts/app.js" type="text/javascript"></script>
<script type="text/javascript">
    jQuery(document).ready(function () {
        App.init();
    });

    function answerTheQuestion() {
        $.ajax({
            url: basePath + "question/answer/addAnswerDo",
            async: false,
            data: {
                questionId: '<%=question.getId()%>',
                answerContent: $("#answer").val().trim()
            },
            dataType: "json",
            type: "POST",
            success: function () {
                parent.bootbox.alert("提交成功！");
                location.href = basePath + "question/ask/questionInfoDo?questionId=" + <%=question.getId()%>;
            },
            error: function () {
                parent.bootbox.alert("提交失败！");
            }
        })
    }

    function adopt(answerId) {
        $.ajax({
            url: basePath + "question/answer/adoptAnswer",
            async: false,
            data: {
                id: answerId
            },
            dataType: "json",
            type: "POST",
            success: function () {
                parent.bootbox.alert("您已采纳！");
                location.href = basePath + "question/ask/questionInfoDo?questionId=" + <%=question.getId()%>;
            },
            error: function () {
                parent.bootbox.alert("提交失败！");
            }
        })
    }
</script>
<!-- END PAGE LEVEL JAVA_SCRIPTS -->
</body>
<!-- END BODY -->
</html>